<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>开发者平台</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <div class="intro-cards">
        <h1>布局1</h1>
        <div class="grid-intro-data">
            <div class="basic-item data-item-1">
                <div>
                    <div class="data-item-title">用户月活</div>
                    <div class="intro-data-cell">
                        <div class="liner-blue access-data">7,580</div>
                        <div class="font-blue access-cell">万</div>
                    </div>
                </div>
            </div>
            <div class="basic-item data-item-2">
                <div>
                    <div class="data-item-title">合作伙伴</div>
                    <div class="intro-data-cell">
                        <div class="liner-blue access-data">8,500</div>
                        <div class="font-blue access-cell">
                            <div style="font-size: 40px; font-weight: 500;">+</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="basic-item data-item-3">
                <div>
                    <div class="data-item-title">极速接入</div>
                    <div class="intro-data-cell">
                        <div class="liner-green access-data">7</div>
                        <div class="font-green access-cell">天</div>
                    </div>
                </div>
            </div>
            <div class="basic-item data-item-4">
                <div>
                    <div class="data-item-title">设备接入</div>
                    <div class="intro-data-cell">
                        <div class="liner-green access-data">5.89</div>
                        <div class="font-green access-cell">亿</div>
                    </div>
                </div>
            </div>
            <div class="basic-item data-item-5">
                <div>
                    <div class="data-item-title">5 件设备及以上用户数</div>
                    <div class="intro-data-cell">
                        <div class="liner-green access-data">1,160</div>
                        <div class="font-green access-cell">万</div>
                    </div>
                </div>
            </div>
        </div>
        <h1>布局2</h1>
        <div class="platform-support-grid">
            <div class="xiaoai-item support-item-0">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">文档中心</div>
                        <div class="ability-card-subtitle">100+ 文档覆盖接入全流程</div>
                    </div><a data-report-key="I_-c-tOYF" href="#" target="_blank" class="ant-btn card-link-button">
                        <div class="home-link-icon"></div>
                    </a>
                </div>
            </div>
            <div class="xiaoai-item support-item-1">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">帮助中心</div>
                        <div class="ability-card-subtitle">常见问题自助查询</div>
                    </div><a data-report-key="I_-c-tOYF" href="#" target="_blank" class="ant-btn card-link-button">
                        <div class="home-link-icon"></div>
                    </a>
                </div>
            </div>
            <div class="xiaoai-item support-item-2">
                <div class="support-item">
                    <div class="support-item-title">设计指导</div>
                    <div class="support-item-subtitle">软硬件设计规范和指导</div>
                </div><a target="_blank" rel="noopener noreferrer" href="#"
                    class="group-intro-link hover-underline-text">继续了解</a>
            </div>
            <div class="xiaoai-item support-item-3">
                <div class="support-item">
                    <div class="support-item-title">公开课</div>
                    <div class="support-item-subtitle">观看视频快速上手产品接入</div>
                </div><a target="_blank" rel="noopener noreferrer" href="#"
                    class="group-intro-link hover-underline-text">继续了解</a>
            </div>
            <div class="xiaoai-item support-item-4">
                <div class="support-item">
                    <div class="support-item-title">工单中心</div>
                    <div class="support-item-subtitle">专业技术人员在线解答</div>
                </div><a target="_blank" rel="noopener noreferrer" href="#"
                    class="group-intro-link hover-underline-text">继续了解</a>
            </div>
        </div>

        <h1>布局3</h1>
        <div class="intro-toB-title">多维度运营</div>
        <div class="platform-access-grid">
            <div class="xiaoai-item">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">数据看板</div>
                        <div class="ability-card-subtitle">支持 7 种数据看板，及时洞察设备情况</div>
                    </div><a data-report-key="I_-c-tOYF" href="#" target="_blank" class="ant-btn card-link-button">
                        <div class="home-link-icon"></div>
                    </a>
                </div>
            </div>
            <div class="xiaoai-item">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">日志查询</div>
                        <div class="ability-card-subtitle">支持 9 类日志查询，实时排查设备问题</div>
                    </div><a data-report-key="I_-c-tOYF" href="#" target="_blank" class="ant-btn card-link-button">
                        <div class="home-link-icon"></div>
                    </a>
                </div>
            </div>
            <div class="xiaoai-item">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">用户运营</div>
                        <div class="ability-card-subtitle">支持 3 种运营工具，助力管理用户反馈</div>
                    </div><a data-report-key="I_-c-tOYF" href="#" target="_blank" class="ant-btn card-link-button">
                        <div class="home-link-icon"></div>
                    </a>
                </div>
            </div>
            <div class="xiaoai-item">
                <div class="basic-ability-card">
                    <div
                        style="width: 48px; height: 48px; background-image: url(&quot;&quot;);">
                    </div>
                    <div class="ability-card-text">
                        <div class="ability-card-title">商业化赋能</div>
                        <div class="ability-card-subtitle">开放更多品宣窗口，支持多种销售渠道</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>